<!DOCTYPE html>
<html lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1"/>
  <title>生态圈系统-领取优惠券</title>
  <link rel="icon" th:href="@{/images/favicon.ico}" th:mce_href="@{/images/favicon.ico}" type="image/x-icon">
  <link rel="shortcut icon" th:href="@{/images/favicon.ico}" th:mce_href="@{/images/favicon.ico}" type="image/x-icon">

  <!-- CSS  -->
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link href="plugins/bootstrap-4.0.0/css/bootstrap.min.css" th:href="@{/plugins/bootstrap-4.0.0/css/bootstrap.min.css}" type="text/css" rel="stylesheet"/>
  <link href="css/materialize.css" th:href="@{/css/materialize.css}" type="text/css" rel="stylesheet" media="screen,projection"/>
  <link href="plugins/perfect-scrollbar/perfect-scrollbar.css" th:href="@{/plugins/perfect-scrollbar/perfect-scrollbar.css}" type="text/css" rel="stylesheet" media="screen,projection"/>
  <link href="css/style.css" th:href="@{/css/style.css}" type="text/css" rel="stylesheet"/>

  <style>
    .input-field > label:not(.label-icon).active {
      line-height: 0rem;
    }
    .select-wrapper input.select-dropdown {
      font-size: 26px;
      height: 4.5rem;
    }
  </style>
</head>
<body>
  <header>
    <nav class="" role="navigation" style="background-color: #f4f6f9;">
      <div class="nav-wrapper">
        <ul class="right hide-on-med-and-down">
          <li><a class="blue-text waves-effect dropdown-trigger" href="#!" data-target="dropdown1" style="vertical-align: top;"><span th:if="${session.user!=null}" th:text="${session.user.username}">admin</span><i class="material-icons right">arrow_drop_down</i></a></li>
          <li><a class="blue-text waves-effect dropdown-trigger" href="#!" data-target="dropdown1" style="vertical-align: top;"><span sec:authentication="name">admin</span><i class="material-icons right">arrow_drop_down</i></a></li>
          <ul id="dropdown1" class="dropdown-content">
            <li><a href="#modal3" class="waves-effect blue-text modal-trigger">修改密码</a></li>
            <li><a th:href="@{/company/logout}" class="waves-effect blue-text">退出登录</a></li>
          </ul>
        </ul>

        <a href="#" data-target="slide-out" class="sidenav-trigger"><i class="material-icons">menu</i></a>
      </div>
    </nav>
  </header>
  
  <div th:replace="common/aside_admin :: aside"></div>

  <main class="" style="height: calc(100% - 48px); background-color: #f4f6f9;">
    <div class="row">
      <h6 style="margin: 0 0 0 15px;" id="page-title" active-menu="test-search-menu">查询优惠券</h6>
    </div>

    <div class="white" style="margin: 0 15px; height: inherit;">
      <div class="row" style="width: 38rem;">
      </div>
      <div class="row" style="width: 38rem;">
        <div class="col input-field">
          <input type="text" id="customerId" name="customerId" maxlength="12" style="font-size: 40px; font-weight: 700; height: 4.5rem;" >
          <label for="customerId" style="font-size: 26px;">客户ID</label>
        </div>
      </div>
      <div class="row" style="width: 38rem;">
        <div class="col input-field" style="text-align: center;">
          <button class="waves-effect waves-light btn btn-large light-blue darken-1" onclick="validateSubmit();" style="margin: 5px; font-size: 20px;"><i class="material-icons left">search</i>查询</button>
        </div>
      </div>
  	</div>
  </main>

  <!-- <footer class="white page-footer teal">
    <div class="footer-copyright">
      <div class="black-text container">
      Made by <a class="brown-text text-lighten-3" href="http://materializecss.com">Materialize</a>
      </div>
    </div>
  </footer> -->
  
  <div th:replace="common/update_pwd :: #modal3"></div>

  <!--  Scripts-->
  <script src="js/jquery-3.3.1.min.js" th:src="@{/js/jquery-3.3.1.min.js}"></script>
  <script src="js/materialize.js" th:src="@{/js/materialize.js}"></script>
  <script src="plugins/perfect-scrollbar/perfect-scrollbar.min.js" th:src="@{/plugins/perfect-scrollbar/perfect-scrollbar.min.js}"></script>
  <script src="plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js" th:src="@{/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js}"></script>
  <script src="plugins/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js" th:src="@{/plugins/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js}" charset="UTF-8"></script>
  <script src="plugins/bootstrap-sweetalert/sweetalert.min.js" th:src="@{/plugins/bootstrap-sweetalert/sweetalert.min.js}"></script>
  <script src="js/common.js" th:src="@{/js/common.js}"></script>
  <script>
    $("#coupon").focus();

    function validateSubmit() {
    	var customerId = $('#customerId').val().replace(/ /g, '');
    	if(!customerId) {
    		return;
    	}
    	$.ajax({
    		type: "GET",
				url: "/kangchenjunga/api/v1/customers/" + customerId + "/coupons/summary",
				success: function(data){
				  swal({
            title: "ID为" + data.customerId + "的信托客户",
            icon: "success",
            text: "共发放优惠券" + data.totalCoupons + "张,共领取优惠券" + data.totalObtainedCoupons + "张,共使用优惠券" + data.totalUsedCoupons + "张"
				  });
				}
    	});

    }

  </script>

  </body>
</html>
